@charset "utf-8";

/* CSS Document */


/*==================================================
    * @name CSS 扩展插件UI
    * @author 莫胜利/lisfan Cell：18072152020/WeChat：448182355
    * @version - v1.0#2016-01-27
==================================================*/


/* 页面打印数据样式 */

.tool-output {
	position: fixed;
	z-index: 19890129;
	right: 0px;
	top: 50px;
	box-shadow: 0 0 50px rgba(51, 51, 51, 0.4);
	table {
		max-width: 600px;
		table-layout: fixed;
		border-collapse: collapse;
		font-size: 12px;
		border: 1px solid #bbb;
		caption {
			font-size: 14px;
			font-weight: bold;
			padding: 5px 10px 15px;
		}
		tr:nth-of-type(odd) {
			background-color: #ddd;
		}
		tr:nth-of-type(1) {
			background-color: #ccc;
		}
		th {
			font-size: 14px;
		}
		td:nth-of-type(1) {
			width: 30%;
		}
		td:nth-of-type(2) {
			width: 40%;
		}
		td:nth-of-type(1) {
			width: 30%;
		}
		th,
		td {
			border: 1px solid #bbb;
			padding: 5px 10px;
			font-family: arial;
			font-weight: bold;
		}
	}
	.output-content {
		display: none;
		position: relative;
		z-index: 100;
		padding: 10px;
		background-color: #fff;
	}
	.tool-btn {
		position: absolute;
		z-index: 50;
		left: 0px;
		margin-left: -28px;
		padding: 8px 6px 8px 10px;
		width: 12px;
		height: 40px;
		color: #fff;
		font-size: 12px;
		text-align: center;
		line-height: 20px;
		border-top-left-radius: 10px;
		border-bottom-left-radius: 10px;
		cursor: pointer;
		&:hover {
			padding-right: 10px;
			transform: translate(-4px);
		}
		&.tool-btn-expand {
			top: 10px;
			background-color: #3185EC;
			box-shadow: -3px 0px 7px -3px #044EA9 inset;
		}
		&.tool-btn-close {
			display: none;
			top: 75px;
			background-color: #f33333;
			box-shadow: -3px 0px 7px -3px #790303 inset;
		}
	}
	&.active {
		right: 50px;
		.output-content {
			display: block;
		}
		.tool-btn-close {
			display: block;
		}
	}
}


/* 分页插件 */

.ext-pagination {
	padding-top: 60px;
	padding-bottom: 50px;
	font-size: 12px;
	.paging-num {
		display: inline-block;
		vertical-align: middle;
		*display: inline;
		*zoom: 1;
		height: 28px;
		margin: 0 2px;
		padding: 0 10px;
		line-height: 26px;
		text-decoration: none;
		border: 1px solid #ccc;
		border-radius: 3px;
		color: #333;
		background-color: #f5f5f5;
		text-align: center;
		white-space: nowrap;
		cursor: pointer;
		touch-action: manipulation;
		-ms-touch-action: manipulation;
		-webkit-user-select: none;
		-moz-user-select: none;
		-o-user-select: none;
		-ms-user-select: none;
		user-select: none;
		&:hover,
		&.selected {
			border-color: #366dd1;
			background-color: #fff;
			color: #366dd1;
		}
		&:active {}
		&.disabled {
			opacity: .65;
			filter: alpha(opacity=65);
			cursor: default
		}
		&.next-paging,
		&.prev-paging,
		&.first-paging,
		&.last-paging {
			width: auto;
			padding: 0px 10px;
			color: #fff;
			border-color: #366dd1;
			background-color: #366dd1
		}
		&.next-paging:hover,
		&.prev-paging:hover,
		&.first-paging:hover,
		&.last-paging:hover {
			border-color: #255dc3;
			background-color: #255dc3;
		}
	}
	.paging-jump {
		margin-left: 10px;
		display: inline-block;
		vertical-align: middle;
		*display: inline;
		*zoom: 1;
		.jump {
			height: 30px;
			color: #555;
			border: 1px solid #d2d2d2;
			background-color: #fff;
		}
	}
	.paging-limit {
		margin-right: 10px;
		display: inline-block;
		vertical-align: middle;
		*display: inline;
		*zoom: 1;
		.limit {
			height: 30px;
			color: #555;
			border: 1px solid #d2d2d2;
			background-color: #fff;
		}
	}
	.paging-container {
		float: left;
	}
	.paging-info {
		line-height: 30px;
		float: right;
		em {
			font-weight: bold;
		}
	}
}


/* 视图插件 */

.ext-panelview {
	padding: 10px;
	.ext-content {
		margin-top: -10px;
		.ext-node {
			float: left;
			margin: 10px 10px 0px 0;
			padding: 8px 10px;
			color: #333;
			line-height: 12px;
			white-space: nowrap;
			border-radius: 3px;
			background-color: #efefef;
			border: 1px solid #aaa;
			-ms-user-select: none;
			-moz-user-select: none;
			-o-user-select: none;
			-webkit-user-select: none;
			user-select: none;
			&:hover {
				border: 1px solid #888;
			}
			&.disabled {
				color: #ccc;
				cursor: default;
				border: 1px solid #ccc;
				&:hover {
					color: #ccc;
					cursor: default;
				}
				.iconfont {
					cursor: default;
				}
			}
			.iconfont {
				position: relative;
				top: -1px;
				font-size: 14px;
				cursor: pointer;
				vertical-align: middle;
			}
		}
	}
	.ext-control {
		font-size: 14px;
		color: #333;
		margin-bottom: 10px;
		.notice {
			line-height: 30px;
		}
		.btn {
			float: right;
			margin-left: 5px;
		}
	}
}


/* 选择视图插件 */

.ext-select-panelview {
	position: relative;
	padding: 0;
	padding-right: 25px;
	min-width: 61px;
	min-height: 32px;
	height: auto;
	line-height: 32px;
	color: #555;
	text-align: left;
	border: 1px solid #d2d2d2;
	background-color: #fff;
	cursor: pointer;
	outline: 0 none;
	-ms-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	-webkit-user-select: none;
	user-select: none;
	.ext-content {
		padding: 5px 0 0 5px;
		.ext-node {
			float: left;
			margin: 0 5px 5px 0;
			padding: 2px 5px;
			max-width: 100%;
			line-height: 14px;
			white-space: nowrap;
			border-radius: 3px;
			border: 1px solid #ccc;
			background-color: #f5f5f5;
			cursor: default;
			.iconfont {
				position: relative;
				top: -1px;
				font-size: 14px;
				cursor: pointer;
				vertical-align: middle;
			}
			img {
				vertical-align: top;
				margin-right: 3px;
				height: 14px;
				font-size: 0px;
				line-height: 0px;
			}
		}
	}
	.placeholder {
		display: none;
		padding: 0 0 0 10px;
		margin-right: 15px;
		font-size: 12px;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		color: #a9a9a9;
	}
	.switch-icon {
		position: absolute;
		right: 8px;
		top: 50%;
		margin-top: -2px;
		border-top: 5px solid hsl(0, 0%, 65%);
		border-left: 5px dashed hsla(0, 0%, 0%, 0);
		border-right: 5px dashed hsla(0, 0%, 0%, 0);
		border-bottom: 0 none;
		display: block;
		width: 0;
		height: 0;
		overflow: hidden;
		line-height: 0;
		font-size: 0;
	}
	.single {
		margin-right: 15px;
		padding: 0 0 0 10px;
		height: 32px;
		line-height: 32px;
		font-size: 12px;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		.ext-node {
			display: inline;
			margin: 0;
			padding: 0;
			line-height: 30px;
			background-color: transparent;
			border: none;
			box-shadow: none;
			img {
				vertical-align: top;
				margin-right: 3px;
				margin-top: 8px;
				height: 14px;
				font-size: 0px;
				line-height: 0px;
			}
			.iconfont {
				display: none;
			}
		}
	}
	&:hover {
		border: 1px solid #508cf9;
	}
	&.active {
		border: 1px solid #508cf9;
		outline: 0 none;
		-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(80, 140, 249, .6);
		box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(80, 140, 249, .6);
		.switch-icon {
			margin-top: -3px;
			border-top: 0 none;
			border-bottom: 5px solid rgb(166, 166, 166);
		}
	}
	&.ext-disabled {
		cursor: default;
		border: 1px solid #ddd;
		.ext-node {
			color: #ccc;
		}
		&:hover {
			border: 1px solid #ddd;
		}
	}
}


/* 下拉插件 */

.ext-droplist {
	position: relative;
	margin: 0;
	padding: 0;
	overflow: auto;
	font-size: 12px;
	list-style: none;
	background: #fff;
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
	border: 1px solid #d2d2d2;
	.ext-content {
		overflow: hidden;
	}
	.ext-node {
		margin: 0;
		padding: 8px 10px;
		white-space: nowrap;
		cursor: pointer;
		color: #555;
		outline: 0 none;
		-ms-user-select: none;
		-moz-user-select: none;
		-o-user-select: none;
		-webkit-user-select: none;
		user-select: none;
		img {
			height: 20px;
			font-size: 0px;
			line-height: 0px;
			vertical-align: middle;
			margin-right: 4px;
		}
		.name {
			_display: block;
			_zoom: 1;
		}
		&:hover,&.hover {
			background: #eee;
		}
		&:focus {
			outline: 0 none;
		}
		&.selected {
			background: #3870F3;
			color: #eee;
			&:hover,&.hover {
				background: #3870F3;
				color: #eee;
			}
		}
		&.disabled {
			color: #ccc;
			cursor: default;
			background: transparent;
			&:hover,&.hover {
				color: #ccc;
				cursor: default;
				background: transparent;
			}
		}
	}
	&.ext-disabled {
		border: 1px solid #ddd;
		.ext-node {
			color: #ccc;
			cursor: default;
			&:hover {
				background: transparent;
			}
			&.selected {
				background: #79a1ff;
				color: #eee;
				&:hover {
					background: #79a1ff;
					color: #eee;
				}
			}
		}
	}
}


/* 树列表插件 */

.ext-treelist {
	position: relative;
	overflow: hidden;
	margin: 0;
	padding: 0;
	font-size: 12px;
	list-style: none;
	background: #fff;
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
	border: 1px solid #dcdcdc;
	.ext-child-content {
		display: none;
		padding-left: 12px;
		&.active {
			display: block;
		}
	}
	.ext-expander {
		position: absolute;
		top: 0;
		display: inline-block;
		width: 20px;
		height: 100%;
		margin-left: -20px;
		&:after {
			content: "";
			position: absolute;
			top: 50%;
			margin-left: 8px;
			margin-top: -2px;
			border: 4px solid transparent;
			border-top-color: #777;
			font-size: 0px;
			line-height: 0;
			cursor: pointer;
			transform: rotate(-90deg);
			transform-origin: 50% 25%;
			text-indent: 0px;
		}
		&.active {
			&:after {
				transform: rotate(0);
			}
		}
	}
	.ext-node-container {
		position: relative;
	}
	.ext-node {
		position: relative;
		margin: 0;
		padding: 8px 10px 8px 20px;
		white-space: nowrap;
		cursor: pointer;
		color: #555;
		outline: 0 none;
		display: block;
		overflow: hidden;
		text-overflow: ellipsis;
		-ms-user-select: none;
		-o-user-select: none;
		-moz-user-select: none;
		-webkit-user-select: none;
		user-select: none;
		img {
			height: 20px;
			font-size: 0px;
			line-height: 0px;
			vertical-align: middle;
			margin-right: 4px;
		}
		.name {}
		&:hover {
			background: #EEE;
		}
		&:focus {
			outline: 0 none;
		}
		&.selected {
			background: #3870F3;
			color: #FFF;
			&:hover {
				background: #3870F3;
				color: #FFF;
			}
		}
		&.disabled {
			color: #CCC;
			cursor: default;
			background: #FFF;
			&:hover {
				color: #CCC;
				cursor: default;
				background: #FFF;
			}
		}
      &.hover{
          background-color:#EEE; 
      }
	}
	.ext-loader {
		margin-left: 6px;
		padding: 0px;
	}
}


/* 列表插件 */

.ext-selectbox {
	margin-left: 1px;
	.header {
		padding-bottom: 10px;
		.title {
			float: left;
		}
	}
	.ext-node {
		position: relative;
		float: left;
		width: 50px;
		padding: 10px;
		margin: 10px;
		margin-left: -1px;
		margin-top: -1px;
		border: 1px solid hsl(0, 0%, 82%);
		cursor: pointer;
		/*框的高宽*/
		&:hover {
			background-color: #eee;
		}
		&.selected {
			background-color: #eee;
		}
		&.selected .icon-state {
			font-size: 18px;
			line-height: 18px;
		}
		.icon-state {
			position: absolute;
			top: 2px;
			right: 2px;
			color: #FB496B;
			font-size: 0px;
			line-height: 0px;
		}
		a {
			display: block;
			font-size: 12px;
			text-align: center;
			color: #333;
			overflow: hidden;
			text-overflow: ellipsis;
			&:hover {
				text-decoration: none;
			}
		}
		img {
			display: block;
			width: 48px;
			height: 48px;
			margin-bottom: 4px;
		}
		.name {
			white-space: nowrap;
			letter-spacing: 1px;
		}
	}
}


/* 下拉视图插件 */


/*.ext-viewer {
	-webkit-user-select: none;
	user-select: none;
	position: relative;
	display: inline-block;
	padding: 0;
	text-align: left;
	border: 1px solid #d2d2d2;
	background-color: hsl(0, 100%, 100%);
	vertical-align: middle;
	cursor: pointer;
	outline: 0 none;
	line-height: 30px;
	min-height: 32px;
	color: #555;
	&.disabled {
		color: #999;
		&:hover {
			border: 1px solid #d2d2d2;
		}
	}
	&:hover {
		border: 1px solid #508cf9;
	}
	&.focus {
		border: 1px solid #508cf9;
		outline: 0 none;
		-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(80, 140, 249, .6);
		box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(80, 140, 249, .6);
		background-color: hsl(36, 29%, 97%);
		.selectbox-icon {
			margin-top: -3px;
			border-top: 0 none;
			border-bottom: 5px solid hsl(0, 0%, 65%);
		}
	}
	.ext-content {
		height: 100%;
		padding: 6px 0 0 5px;
		display: block;
	}
	.ext-node {
		float: left;
		margin: 0 5px 5px 0;
		padding: 2px 5px;
		border: 1px solid #ccc;
		max-width: 100%;
		border-radius: 3px;
		background-color: #f5f5f5;
		background-size: 100% 19px;
		background-repeat: repeat-x;
		background-clip: padding-box;
		box-shadow: 0 0 2px hsl(0, 100%, 100%) inset, 0 1px 0 hsla(0, 0%, 0%, 0.05);
		line-height: 14px;
		white-space: nowrap;
		cursor: default;
		.iconfont {
			font-size: 14px;
			cursor: pointer;
		}
		img {
			vertical-align: top;
			margin-right: 3px;
			height: 14px;
			font-size: 0px;
			line-height: 0px;
		}
	}
	.placeholder {
		display: none;
		padding: 0 0 0 10px;
		margin-right: 15px;
		font-size: 12px;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}
	.single {
		padding: 0 0 0 10px;
		margin-right: 15px;
		font-size: 12px;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		height: 32px;
		line-height: 30px;
		.ext-node {
			padding: 0;
			background-color: transparent;
			border: none;
			line-height: 30px;
			box-shadow: none;
			img {
				vertical-align: top;
				margin-right: 3px;
				margin-top: 8px;
				height: 14px;
				font-size: 0px;
				line-height: 0px;
			}
			.iconfont {
				display: none;
			}
		}
	}
	.selectbox-icon {
		position: absolute;
		right: 4px;
		top: 50%;
		margin-top: -2px;
		border-top: 5px solid hsl(0, 0%, 65%);
		border-left: 5px dashed hsla(0, 0%, 0%, 0);
		border-right: 5px dashed hsla(0, 0%, 0%, 0);
		border-bottom: 0 none;
		display: block;
		width: 0;
		height: 0;
		overflow: hidden;
		line-height: 0;
		font-size: 0;
	}
}*/


/* 节点状态样式 */


/*
//节点状态
//悬浮灰度高亮
.ext-node:hover {
	background: #EEE;
}

//禁用（文字变灰）
.ext-node.disabled {
	color: #aaa;
}

//选中禁用
.ext-node.selected.disabled {
	background: #6f98fa;
	color: #FFF;
	&:hover {
		background: #6f98fa;
		color: #FFF;
	}
}*/

//勾选：多选模式
//多选：未选中
.ext-node.ext-checkbox .ext-btn-checker {
	display: inline-block;
	vertical-align: middle;
	*display: inline;
	*zoom: 1;
	margin-top: -2px;
	margin-right: 4px;
	width: 12px;
	height: 12px;
	font-size: 0px;
	line-height: 0px;
	background-image: url(../../checkbox.png);
	cursor: pointer;
	background-position: 0 -0px;
}

//多选：选中
.ext-node.ext-checkbox.checked .ext-btn-checker {
	background-position: 0 -12px;
}

//多选：部分选中
.ext-node.ext-checkbox.checked-part .ext-btn-checker {
	background-position: 0 -24px;
}

//多选：禁用未选中
.ext-node.ext-checkbox.disabled .ext-btn-checker {
	background-position: 0 -36px;
	cursor: default;
}

//多选：禁用已选中
.ext-node.ext-checkbox.checked.disabled .ext-btn-checker {
	background-position: 0 -48px;
	cursor: default;
}

//单选模式
//单选：未选中
.ext-node.ext-radio .ext-btn-checker {
	display: inline-block;
	vertical-align: middle;
	*display: inline;
	*zoom: 1;
	margin-top: -2px;
	margin-right: 4px;
	width: 12px;
	height: 12px;
	font-size: 0px;
	line-height: 0px;
	background-image: url(../../checkbox.png);
	cursor: pointer;
	background-position: 0 -60px;
}

//单选：已选中
.ext-node.ext-radio.checked .ext-btn-checker {
	background-position: 0 -72px;
}

//单选：部分选中
.ext-node.ext-radio.checked-part .ext-btn-checker {
	background-position: 0 -84px;
}

//单选：禁用未选中
.ext-node.ext-radio.disabled .ext-btn-checker {
	background-position: 0 -96px;
	cursor: default;
}

//单选：禁用未选中
.ext-node.ext-radio.checked.disabled .ext-btn-checker {
	background-position: 0 -108px;
	cursor: default;
}

//插件禁用：文字变灰
.ext-disabled {
	//border: 1px solid #ddd;
	.ext-node {
		color: #ccc;
	}
}


/* 即时下拉 */

.ext-search-filter {
	.ext-viewer {
		input {
			height: 20px;
			line-height: 20px;
			padding: 5px 10px;
			color: #555;
			border: 1px solid #d2d2d2;
			background-color: #fff;
			outline: 0;
			vertical-align: middle;
			display: inline-block;
			_display: inline;
			_zoom:1;
			&:focus {
				border-color: #508cf9;
				outline: 0;
				-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(80, 140, 249, .6);
				box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(80, 140, 249, .6);
			}
			&[disabled] {
				color: #a9a9a9;
			}
			&.error-input {
				border-color: #DF676B;
				outline: 0;
				-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(223, 103, 107, 0.6);
				box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(223, 103, 107, 0.6);
			}
		}
		.placeholder {
			position: absolute;
			left: 10px;
			top: 50%;
			margin-top: -0.5em;
			line-height: 1em;
			font-size: 1em;
			color: #a9a9a9;
		}
		.switch-icon {
			position: absolute;
			right: 8px;
			top: 50%;
			margin-top: -2px;
			border-top: 5px solid hsl(0, 0%, 65%);
			border-left: 5px dashed hsla(0, 0%, 0%, 0);
			border-right: 5px dashed hsla(0, 0%, 0%, 0);
			border-bottom: 0 none;
			display: block;
			width: 0;
			height: 0;
			overflow: hidden;
			line-height: 0;
			font-size: 0;
		}
		&.active {
			.form-control {
				border-color: #508cf9;
				_border: none;
				outline: 0 none;
				-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(80, 140, 249, .6);
				box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(80, 140, 249, .6);
			}
			.switch-icon {
				margin-top: -3px;
				border-top: 0 none;
				border-bottom: 5px solid rgb(166, 166, 166);
			}
		}
	}
}

.ext-exter {
	position: relative;
}